body{
overflow-x: hidden;
}
.privPol{
width: auto;
position: fixed;
height: auto;
padding: 4px 10px;
background-color: black;
color: #fff;
top: 0px;
right: 57%;
font-weight: bold;
text-decoration: none;
font-size: .9em;
box-shadow: 0px 4px 5px -5px black;
z-index: 8;
}
.privPolOUT{
width: 100%;
float:left;
height: auto;
padding-bottom:15px;
}
.homeBody{
background-repeat: no-repeat;
background-size: 100% 445px;
font-family: "Open Sans",sans-serif;
font-size: 1em;
height: 100%;
margin: 0;
padding: 0;
width: 100%;
}
.inBody{
background-image: url("../images/insideBG.jpg");
background-repeat: no-repeat;
background-size: 100% 237px;
font-family: "Open Sans",sans-serif;
font-size: 15px;
margin: 0;
padding: 0;
height: 100%;
width: 100%;
}
p{
margin: 0px;
padding: 0px;
}    
a{
outline: none;
}
img{
border: 0px;
}	
.clear{
clear: both;
}	
a, span, div, button, p, input, li {
transition: all .3s ease-in-out;
}    


/*UNIVERSAL STYLE ABOVE*/

.photodd{
float: left;
height: auto;
padding-top: 12px;
width: 100%;
}
.photodd form{
background-color: #ededed;
border-radius: 0.3em;
float: right;
height: auto;
margin: 14px;
padding: 10px;
width: auto;
}
.ptg{
border-right: 1px solid #ededed;
color: black;
float: left;
font-size: 12px;
height: auto;
margin: 0;
padding: 0 6px;
text-decoration: none;
width: auto;
}
.ptg:last-child{
border-right: none;
}
.ptg:hover{
opacity: .3;
}
.photodd form .imgUP{
float: right;
font-size: 12px;
height: auto;
margin-right: 6px;
width: 190px;
}
.photodd form .imgUPsave{
float: right;
font-size: 12px;
height: auto;
width: auto;
}
.galleryAdmin{
float: left;
height: auto;
width: 100%;
}
.galleryAdmin form{
float: left;
height: auto;
margin-bottom: 5px;
padding-bottom: 6px;
width: 100%;
}
.galleryAdmin form .imgUP{
float: right;
font-size: 12px;
height: auto;
margin-right: 6px;
width: 72px;
}
.galleryAdmin form .imgUPsave{
float: right;
font-size: 12px;
height: auto;
width: auto;
}
.galForm{
width: 120px;
height: 100px;
float: left;
background-color: silver;
padding: 4px;
border-radius: .3em;
margin: 7px;
}
.galForm img{
height: 100%;
width: 100%;
}
.galForm .delButton{
background: none repeat scroll 0 0 #ffffff;
border: medium none;
box-shadow: 0 4px 4px -5px #000000;
cursor: pointer;
height: auto;
margin-left: -11px;
margin-top: -12px;
position: absolute;
width: auto;
}
.galForm .delButton:hover, .subsup:hover{
opacity: .4;
}
.suppright{
background-color: #ededed;
float: right;
height: auto;
padding: 18px;
width: 42%;
}
.suppright div form{
float: left;
height: 56px;
margin: 10px;
width: 138px;
}
.suppright div form img{
float: left;
height: 100%;
margin: 10px;
width: 100%;
}

.photodd form .imgUPsave{
float: right;
font-size: 12px;
height: auto;
width: auto;
}

.hh3 {
border-radius: 0.2em;
float: left;
height: 207px;
margin: 11px;
position: relative;
width: 149px;
}
.hh3 img {
height: auto;
width: 100%;
}
.hh3 span {
float: left;
font-size: 12px;
height: auto;
line-height: 1.2em;
width: 100%;
}
.insideMainIMG {
background-color: white;
box-shadow: 0 5px 5px -6px black;
float: left;
height: 200px;
margin-bottom: 17px;
margin-top: 34px;
position: relative;
width: 100%;
}
.insideMainIMG img{
height: 100%;
width: 100%;
}
.insideMainIMG p{
background-color: white;
box-shadow: 0 5px 5px -5px black;
float: left;
font-size: 35px;
height: auto;
margin: 15px;
padding: 11px 29px;
position: absolute;
width: auto;
}
.editG{
float: left;
height: auto;
margin-bottom: 10px;
margin-top: 37px;
min-height: 400px;
width: 100%;
}
.editG a {
background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
font-weight: 600;
height: auto;
margin-left: 2px;
text-decoration: none;
}
.galWrapper{
float: left;
height: auto;
margin-bottom: 10px;
margin-top: 37px;
min-height: 400px;
width: 100%;
}
.galWrapper a {
background-color: white;
float: left;
height: 113px;
margin: 8px;
padding: 5px;
width: 192px;
}
.galWrapper a:hover, .editG a:hover{
opacity: .3;
}
.galWrapper a img{
height: 100%;
width: 100%;
}
.mtRap {
float: left;
height: auto;
min-height: 300px;
width: 100%;
}

.mtRapIN {
height: auto;
margin: 7px auto 10px;
padding: 0 20px;
width: 1200px;
}
.mtRapL {
background-color: #ededed;
float: left;
height: auto;
margin-right: 10px;
padding: 17px;
width: 16%;
}
.mtRapL ul {
float: left;
height: auto;
list-style: outside none none;
margin: 0;
padding: 0;
width: 100%;
}
.mtRapL ul p{
float: left;
font-size: 16px;
font-weight: 300;
height: auto;
line-height: 1.2em;
margin-bottom: 18px;
width: 100%;
}
.mtRapL ul li{
border-bottom: 1px dotted #c6c6c6;
float: left;
height: auto;
line-height: 1.2em;
margin-bottom: 7px;
padding-bottom: 9px;
width: 100%;
}
.mtRapL ul li:last-child{
border-bottom: none;
}
.mtRapL ul li a{
color: black;
float: left;
font-size: 14px;
font-weight: 600;
height: auto;
text-decoration: none;
width: 100%;
}
.mtRapL ul li a:hover{
opacity: .3;
}
.mtRapR {
float: right;
height: auto;
width: 79%;
}
.mtRapR div {
float: left;
height: 204px;
margin: 7px;
overflow: hidden;
width: 144px;
}
.mtRapR div img{
float: right;
height: 145px;
margin-bottom: 3px;
width: auto;
}
.mtRapR div span{
float: right;
font-size: 11px;
height: auto;
line-height: 1.2em;
width: 100%;
}
.mainIMag{
float: left;
height: auto;
width: 100%;
}
.mainIMagIN {
float: left;
height: auto;
margin-top: 139px;
width: 100%;
}
.error{
background-color: #ffffff;
border: 1px solid #c0c0c0;
border-radius: 0 0.3em 0.3em 0;
box-shadow: 0 4px 5px -7px #000000;
font-size: 14px;
font-weight: bold;
left: 0;
padding: 10px;
position: absolute;
top: 39px;
z-index: 22999;
}
.welcomeScreen {
background-color: red;
float: left;
height: auto;
margin-top: 24px;
width: 100%;
}
.welcomeScreen img {
border-radius: 0.5em;
box-shadow: 0 6px 7px -5px #000000;
height: auto;
width: 100%;
}
.top{
height: 140px;
left: 0;
position: absolute;
right: 0;
width: 80%;
z-index:8;
padding: 1em 10%;
}
.topIN{
height: 141px;
margin: auto;
padding: 0 0;
width: 100%;
} 
.topINL{
float: left;
height: auto;
width: 177px;
padding-top: 1em;
}  
.topINL img{
height:auto;
width: 100%;
}
.sloo {
float: left;
height: auto;
margin-bottom: -5px;
margin-top: -12px;
padding: 4px;
width: 177px;
}     
.imgll{
clear: both;
float: left;
font-size: 12px;
margin-bottom: 12px;
overflow: hidden;
width: 413px;
}     
.topINRAdmin {
float: right;
height: auto;
width: 75%;
} 
.topINR{
float: right;
height: auto;
width: 80%;
} 
.topINR .topINR1{
float: right;
height: auto;
margin-bottom: 1.5em;
width: 100%;
line-height: 1em;
} 
.topINR .topINR1 p, .topINRAdmin p{
float: right;
height: auto;
margin-right: 5px;
width: auto;
}    
.topINR .topINR1 span, .topINRAdmin span{
background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
border: medium none;
float: right;
font-weight: 400;
height: auto;
margin-right: 2%;
width: auto;
}     
.topINR .topINR1 a{
border: 1px solid #ededed;
border-radius: 5px;
color: #ffffff;
float: right;
height: auto;
padding: 6px 14px;
text-decoration: none;
text-shadow: 1px 1px #000000;
width: auto;
font-size: .78em;
margin-top: -7px;
}         
.topINR .topINR1 a:hover{
opacity: .4;
}             
.topINR .topINR2{
float: right;
height: 43px;
width: 100%;
} 
.topINR .topINR2 ul{
height: auto;
list-style: outside none none;
margin: 0;
padding: 0;
width: 100%;
}    
.topINR .topINR2 ul li{
float: right;
height: auto;
width: auto;
}
.topINR .topINR2 ul li a{
float: left;
font-size: 13px;
height: auto;
padding: 12px;
text-decoration: none;
width: auto;
}

.topINRAdmin .adminNav{
float: right;
height: 43px;
width: 100%;
} 
.topINRAdmin .adminNav ul{
height: auto;
list-style: outside none none;
margin: 0;
padding: 0;
width: 100%;
}    
.topINRAdmin .adminNav ul li{
float: right;
height: auto;
width: auto;
}
.topINRAdmin .adminNav ul li a{
float: left;
font-size: 11px;
height: auto;
padding: 12px 6px;
text-decoration: none;
width: auto;
}
.topINRAdmin .adminNav ul li a:hover{
color: white;
}
.howtochange, .showLbg p{
color: #808080;
float: left;
font-size: 10px;
font-weight: 300;
height: auto;
margin-bottom: 2px;
margin-top: -23px;
text-decoration: none;
width: 100%;
}
.colLinks{
border-right: 1px solid #ededed;
color: #808080;
float: left;
font-size: 12px;
font-weight: 300;
height: auto;
padding: 4px 8px;
text-decoration: none;
width: auto;
}
.colLinks:hover, .howtochange:hover{
opacity: .4;
}
.colLinks:last-child{
border: 0;
}
.coloursAdmin{
float: left;
height: auto;
margin-bottom: 28px;
width: 100%;    
}
.SMM{
background-color: #ffffff;
border: 10px solid #ededed;
border-bottom-left-radius: 1em;
border-bottom-right-radius: 1em;
left: 5%;
min-height: 400px;
padding: 20px;
position: absolute;
right: 5%;
text-align: center;
top: -12px;
width: auto;
z-index: 99999;
}
.SMM img{
width: 100%;
height: auto;
}
.SMMa{
background-color: #0099ff;
border: 1px solid #000000;
color: #ffffff;
float: left;
font-size: 13px;
height: auto;
padding: 6px;
text-decoration: none;
width: auto;
}
.SMMa:hover{
opacity: .4;
}
.phonN {
border: 1px solid #e4e4e4;
float: left;
height: auto;
margin-bottom: -5px;
margin-top: -9px;
padding: 4px;
width: 206px;
}
.doffie{
border: 1px solid #e4e4e4;
float: left;
height: auto;
margin-bottom: -5px;
margin-top: -4px;
padding: 4px;
width: 206px;
}
.phonNTit {
border: 1px solid #e4e4e4;
float: left;
height: auto;
margin-bottom: -5px;
margin-top: -9px;
padding: 4px;
width: 300px;
}
.topINR .topINR2 ul li a:hover{
color: white;
border-top-left-radius: .2em;
border-top-right-radius: .2em;
}
.topSrap{
float: left;
height: auto;
width: 80%;
padding: 0px 10% 2em 10%;
text-align: center;
}
.topSrapINside {
float: left;
height: auto;
margin-top: 158px;
width: 100%;
}
.galleryContainer11{
height: auto;
min-height: 400px;
width: 1200px;
margin: auto;
}
.galleryContainer11 a{
color: #ff0000;
font-weight: bold;
height: auto;
text-decoration: none;
width: auto;
}
.galleryContainer11 a:hover{
opacity: .4;
}
.galleryContainer{
height: auto;
min-height: 400px;
width: 1200px;
margin: auto;
}
.galleryContainer a{
border: 1px solid #d8d8d8;
box-shadow: 0 5px 5px -6px #000000;
float: left;
height: 131px;
margin: 9px;
width: 180px;
}
.galleryContainer a:hover{
opacity: .4;
}
.galleryContainer img{
float: left;
height: 100%;
width: 100%;
}
.topSIN{
float: left;
height: 453px;
margin: auto;
width: 100%;
}    
.topSIN img{
height: 100%;
width: 100%;
}   
.pgeSpacer{    
float: left;
height: auto;
width: 80%;
padding: 0 10%;
} 
.inbodycon{
height: auto;
margin: 1em 0;
width: 100%;
display: inline-block;
}
.inbodycon .inL{
float: left;
height: auto;
margin-right: 1%;
width: 35%;
text-align: left;
}
.inbodycon .inL h1{
color: #5a5a5a;
font-size: 1.5em;
font-weight: 600;
height: auto;
float: left;
padding: 0;
width: 100%;
margin: 0em 0 1em 0;
line-height: 1em;
}
.inbodycon .inL p{
float: left;
height: auto;
width: 100%;
}
.inbodycon .inL a {
color: red;
font-weight: 600;
height: auto;
text-decoration: none;
width: auto;
}
.inbodycon .inL a:hover{
opacity: .3;
}
.inbodycon .inL span{
color: #42c242;
float: left;
font-size: 13px;
font-weight: 700;
height: auto;
margin-bottom: -3px;
margin-top: 18px;
width: 100%;
}
.inbodycon .inL div {
float: left;
height: 103px;
margin: 0 5px 21px;
width: 21.4%;
}
.inbodycon .inL img{
height: 100%;
width: 100%%;
}
.inbodycon .inL ul{
background-color: #ededed;
background-image: url("../images/downloads.png");
background-repeat: no-repeat;
float: left;
height: auto;
list-style: outside none none;
margin: 22px 0 0;
padding: 12px;
width: 95%;
}   
.inbodycon .inL ul p{
float: left;
font-size: 12px;
font-weight: 300;
height: auto;
margin-bottom: 11px;
padding-bottom: 7px;
width: 82%;
}
.inbodycon .inL ul div{
float: right;
height: 100px;
width: 48%;
}     
.inbodycon .inL ul div img{
height: auto;
width: 100%;
}     
.inbodycon .inL ul li{
clear: left;
cursor: pointer;
float: left;
height: auto;
margin-bottom: 5px;
width: 54%;
}
.inbodycon .inL ul li img{
float: left;
height: auto;
width: auto;
}
.inbodycon .inL ul li:hover{
opacity: .3;
}
.inbodycon .inL ul li a{
border-radius: 0.1em;
color: white;
float: left;
font-size: 13px;
height: auto;
margin-bottom: 3px;
padding: 5px 14px;
text-decoration: none;
width: auto;
}
.inbodycon .inM{
float: left;
height: auto;
margin-left: 1%;
width: 32%;
}
.inbodycon .inM a{
float: left;
height: auto;
width: auto;
}
.inbodycon .inM a img{
height: auto;
width:100%;
}
/*.inbodycon .inM div{
float: left;
height: auto;
position: relative;
width: 100%;
}*/
/*.inbodycon .inM span{
float: left;
height: auto;
position: relative;
width: 30%;
}*/
.inbodycon .inM span:nth-child(3){
margin: 0px 5px;
}
/*.inbodycon .inM div img{
height: auto;
width: 100%;
}
.inbodycon .inM span img{
height: 99px;
width: 100%;
}
.inbody1con .inM a{
float: left;
height: auto;
width: auto;
}*/
.inbodycon .inM a:hover {
opacity: .4;
}
.inbodycon .inM a:nth-child(3){
margin: 0px 11px;
}
.inbodycon .contactRight{
float: right;
height: auto;
width: 57%;
}
.inbodycon .contactRight img{
height: 100%;
width: 100%;
}
.inbodycon .inM .midIMG{
height: auto;
margin-bottom: 4px;
width: 100%;
border-radius: 4px;
}
.footerRap{
border-top: 1px solid #ededed;
float: left;
height: auto;
margin: 1em;
padding: 1em 10%;
width: 80%;
}
.inbodycon .inM a .smallIMG{
background-color: #cbcbcb;
float: left;
height: 62px;
margin-bottom: 13px;
width: 100%;
border-radius: 4px;
}

/*.inbodycon .inM a img:nth-child(1) {
margin: 5px 5px 0;
}*/
.inbodycon .inRT{
float: right;
height: auto;
margin-right: 10px;
width: 24%;
}
.inbodycon .inRT a{
background-color: #eaeaea;
color: #525252;
float: left;
font-weight: 300;
height: auto;
margin-bottom: 12px;
padding: 13px 0;
text-align: center;
text-decoration: none;
width: 100%;
}
.inbodycon .inRT a:hover{
opacity: .3;
}
.inbodycon .inR{
float: right;
height: auto;
width: 27%;
}
.inbodycon .inR .rectRight{
float: left;
height: 86px;
margin-bottom: 1em;
padding: 6%;
width: 88%;
border-radius: 5px;
}
.inbodycon .inR .rectRight p{
color: #ffffff;
float: left;
font-size: .9em;
font-weight: 550;
height: 100%;
line-height: 1.1em;
overflow: hidden;
width: 54%;
text-align: left;
}
.inbodycon .inR .rectRight img{
background-color: #eee;
float: right;
height: 100%;
width: 37%;
border-radius: 7px;
}
.pgeSpacerIN{
height: auto;
width: 100%;
padding: 2px 0%;
margin-bottom: 0.3em;
display: inline-block;
}  
.pgeSpacerINLR{
border-top: 1px solid #dfdfdf;
float: left;
height: auto;
margin-top: 21px;
width: 33%;
}            
.pgeSpacerINM{
/*color: #666666;*/
float: left;
font-size: 23px;
font-weight: 300;
height: auto;
margin: 0 10px;
padding-top: 3px;
text-align: center;
width: 30%;
}                               
.adminRpp {
height: auto;
margin: auto auto 30px;
padding: 0 20px;
text-align: center;
width: 1200px;
}
.loginWrap {
height: 400px;
margin: auto auto 30px;
padding: 0 20px;
text-align: center;
width: 1200px;
}
.loginWrap form{
height: 400px;
margin: auto;
width: 300px;
}
.loginWrap form .loginField{
border: 1px solid #ededed;
border-radius: 0.3em;
height: auto;
margin: auto auto 7px;
padding: 10px;
width: 100%;
}
.infoBox1IN{
height: auto;
margin: auto auto 30px;
padding: 0 20px;
text-align: center;
width: 1200px;
}      
.homeBoxRapIN{
height: 300px;
margin: auto auto 35px;
padding: 0 20px;
width: 1200px;
}          
.boxOUT{
box-shadow: 0 8px 9px -9px black;
display: inline-block;
height: 300px;
margin: .3%;
overflow: hidden;
width: 32%;
position: relative;
}   
.boxOUT:hover, .boxIN:hover{
opacity: .4;
}
.boxOUT img, .boxIN img{
border-top-left-radius: 1.5em;
border-top-right-radius: 1.5em;
height: 100%;
width: 100%;
} 
.boxOUT p, .boxIN p{
border-top-left-radius: 1em;
border-top-right-radius: 1em;
color: #ffffff;
font-size: 1.1em;
height: auto;
padding: 12px 0;
position: absolute;
text-align: center;
width: 100%;
} 
.boxOUT p b, .boxIN p b{
color: #000000;
font-weight: 700;
}   
.boxOUT p italic, .boxIN p italic{
color: #ffffff;
font-weight: 600;
}     
.boxOUT span, .boxIN span{
color: #ffffff;
height: 44px;
bottom: 0px;
overflow: hidden;
padding: 10px 2%;
position: absolute;
text-align: center;
width: 96%;
font-size: .85em;
line-height: 1.1em;
}     
.boxIN{
float: left;
height: 300px;
margin: 0 2%;
overflow: hidden;
width: 32%;
}              
.recTangHolder{
height: auto;
display: inline-block;
width: 100%;
}     
.recOUT{
background-image: url("../images/boxGRAYbg.jpg");
background-repeat: repeat-x;
border: 1px solid #e8e8e8;
border-radius: 0.3em;
float: left;
height: 87px;
width: 24.05%;
} 
.recOUT:hover{
opacity: .4;
}
.recOUT1{
background-image: url("../images/boxGRAYbg.jpg");
background-repeat: repeat-x;
border: 1px solid #e8e8e8;
border-radius: 0.3em;
float: left;
height: 87px;
margin-left: 13px;
width: 49%;
} 
.recOUT p{
color: #666666;
float: right;
font-size: 21px;
font-weight: 400;
height: auto;
margin-top: 28px;
width: 72%;
}     
.recOUT img {
float: left;
height: 56px;
margin: 14px 8px 8px 8px;
width: 21%;
}     
.recOUT:nth-child(2){
margin-left: 1%;
}            
.recOUT:nth-child(3){
margin-left: 1%;
margin-right: 1%;
} 
.roundBHolder{
height: 184px;
margin: auto auto 70px;
padding: 0 20px;
width: 1200px;
}
.roundB{
background-color: #efefef;
background-image: url(../images/roundBG.png);
background-repeat: no-repeat;
background-size: 100% 100%;
color: #0037ae;
float: left;
font-size: .7em;
font-weight: bold;
height: 12svh;
margin: 1%;
padding: 2%;
position: relative;
text-align: center;
width: 10%;
word-wrap: break-word;
z-index: 1;
align-items: center;
display: flex;
border-radius: 7px;
}   
.roundB .newbop{
background-color: #ffffff;
border: 1px solid #808080;
color: #000000;
cursor: pointer;
font-size: 9px;
font-weight: normal;
height: auto;
margin-left: 112px;
margin-top: -31px;
padding: 5px;
position: absolute;
text-align: center;
width: auto;
z-index: 99999;    
}              
.newbop:hover{
opacity: .4;
}    
.suppHolder{
height: auto;
display: inline-block;
width: 100%;
} 
.suppHolder p{
float: left;
height: auto;
margin-top: 13px;
width: 61%;
} 
.suppHolder b{
float: right;
height: auto;
width: 39%;
}    
.suppHolder div{
cursor: pointer;
float: right;
height: 49px;
margin-bottom: 6px;
margin-left: 8px;
width: auto;
} 
.suppHolder div:hover{
opacity: .3;
}    
.suppHolder div img{
height: 100%;
width: auto;
}     
.suppRapperOUT{
float: left;
height: auto;
width: 80%;
padding: 0 10%;
}
.footerIN {
padding-top: 38px;
text-align: center;
height: auto;
display: inline-block;
width: 100%;
}    
.footerIN p{
float: left;
height: auto;
margin: auto auto 0;
text-align: center;
width: 100%;
}
.footerIN span{
/*color: #808080;*/
float: left;
font-size: 12px;
height: auto;
margin: 0 auto 12px;
text-align: center;
width: 100%;
}
.footerIN a {
/*color: #808080;*/
float: left;
font-size: 12px;
height: auto;
margin: 0 auto 12px;
text-align: center;
text-decoration: none;
width: 100%;
}    
.footerIN a:hover{
opacity: .4;
}
.inbodycon .inR .downloadsWrapper{
float: left;
height: auto;
width: 98%;
}
.inbodycon .inR .downloadsWrapper p{
float: left;
font-size: 14px;
height: auto;
margin-bottom: 3px;
width: 98%;
}
.inbodycon .inR .downloadsWrapper a{
background-color: #e5e5e5;
float: left;
height: auto;
margin-bottom: 8px;
padding: 5px;
width: 100%;
}
.inbodycon .inR .downloadsWrapper a:hover{
opacity: .4;
}
.inbodycon .inR .downloadsWrapper a img{
float: left;
height: 30px;
margin-right: 3px;
width: 30px;
}
.inbodycon .inR .downloadsWrapper a span{
color: #000000;
float: left;
font-size: 13px;
font-weight: 700;
height: auto;
line-height: 2.2em;
width: 85%;
}
.inbodycon .inL form strong{
color: #8c8c8c;
float: left;
font-size: 20px;
font-weight: 300;
height: auto;
margin-top: 18px;
width: 80%;
}
.inbodycon .inL form b{
color: #8c8c8c;
float: left;
font-size: 13px;
font-weight: 300;
height: auto;
margin-top: 20px;
width: 80%;
}
.inbodycon .inL form .textF{
border: 1px solid #dfdfdf;
color: #000000;
float: left;
font-weight: 300;
height: auto;
padding: 9px;
text-transform: capitalize;
width: 76%;
}
.inbodycon .inL form .textFSUB{
border: 1px solid #dfdfdf;
clear: both;
color: #000000;
cursor: pointer;
float: left;
font-weight: 300;
height: auto;
margin-top: 16px;
padding: 9px;
width: auto;
}
.inbodycon .inL form .textFSUB:hover{
opacity: .4
}

.inbodycon .inL form textarea {
border: 1px solid #dfdfdf;
color: #000000;
float: left;
font-weight: 300;
height: 97px;
padding: 9px;
width: 76%;
}
.logout {
background-color: #ffffff;
border: 1px solid #343434;
box-shadow: 0 4px 5px -5px #000000;
cursor: pointer;
font-size: 12px;
height: auto;
left: 40%;
padding: 10px 12px;
position: absolute;
text-decoration: none;
top: -4px;
width: auto;
z-index: 99999999;
}
.logout:hover{
opacity: .4;
top: -1px;
}
.inbodycon .inL form .wtf {
color: #000000;
float: left;
font-weight: 300;
height: 23px;
padding: 9px 9px 9px 0;
width: 100%;
}
.inbodycon .inL form .checkTit {
color: #8c8c8c;
float: left;
font-weight: 300;
height: auto;
margin-right: 8px;
width: auto;
}
.galleryAdmin{
float: left;
height: auto;
width: 100%;
}
.galleryAdmin form{
float: left;
height: auto;
margin-bottom: 5px;
padding-bottom: 6px;
width: 100%;
}
.galleryAdmin form .imgUP{
float: right;
font-size: 12px;
height: auto;
margin-right: 6px;
width: 72px;
}
.galleryAdmin form .imgUPsave{
float: right;
font-size: 12px;
height: auto;
width: auto;
}

.galForm{
width: 120px;
height: 100px;
float: left;
background-color: silver;
padding: 4px;
border-radius: .3em;
margin: 7px;
}
.galForm img{
width: 100%;
height: 100%;
}
.galForm .delButton{
background: none repeat scroll 0 0 #ffffff;
border: medium none;
box-shadow: 0 4px 4px -5px #000000;
cursor: pointer;
height: auto;
margin-left: -11px;
margin-top: -12px;
position: absolute;
width: auto;
}
.galForm .delButton:hover, .subsup:hover{
opacity: .4;
}
.suppright{
background-color: #ededed;
float: right;
height: auto;
padding: 18px;
width: 42%;
}
.suppright div form{
float: left;
height: 56px;
margin: 10px;
width: 138px;
}
.suppright div form img{
float: left;
height: 100%;
margin: 10px;
width: 100%;
}
.suppright div form .subsup{
background: none repeat scroll 0 0 #ffffff;
border: 1px solid #e5e5e5;
box-shadow: 0 4px 4px -5px #000000;
cursor: pointer;
height: auto;
margin-left: -28px;
position: absolute;
width: auto;
}
.showGallery{
float: left;
height: auto;
min-height: 500px;
width: 100%;
}
.showGallery .showL{
background-color: #ff0000;
float: left;
height: 100px;
margin: 0 6px;
width: 32.3%;
}
.colours .showL form p{
color: #808080;
float: left;
font-size: 10px;
font-weight: 300;
height: auto;
margin-bottom: 2px;
margin-top: -18px;
text-decoration: none;
width: 100%;
}
.bgField{
float: left;
height: auto;
margin-bottom: -3px;
margin-top: -6px;
padding: 4px;
width: 247px;
}
.showPages{
float: left;
height: auto;
width: 100%;
}
.showPages form{
float: left;
height: auto;
width: 204px;
}
.showPages form span{
float: left;
height: auto;
margin: 12px 6px 0;
width: 100%;
}
.delbu{
float: left;
font-size: 12px;
font-weight: bold;
height: auto;
margin-right: 8px;
width: auto;
}
.showGallery form{
float: left;
height: 100px;
width: 167px;
}
.colours{
border-bottom: 1px dotted #cccccc;
float: left;
height: auto;
margin-bottom: 17px;
padding-bottom: 12px;
width: 100%;
}
.colours:last-child{
border-bottom: 0;
}
.CLeft {
float: left;
height: auto;
width: 51%;
}
.downRight {
background-color: #ededed;
float: right;
height: auto;
padding: 16px;
width: 40%;
}
.downRight p{
float: right;
height: auto;
margin-bottom: 11px;
width: 100%;
}
.downRight a{
background-color: #808080;
color: #ffffff;
float: left;
font-size: 12px;
font-weight: 300;
height: auto;
margin-bottom: 4px;
padding: 6px;
text-decoration: none;
width: 98%;
}
.downRight a:hover{
opacity: .3;
}
.downRight a span{
color: yellow;
float: right;
font-size: 12px;
font-weight: 600;
height: auto;
text-decoration: none;
width: auto;
}
.CRight {
float: right;
height: auto;
width: 44%;
}
.CRight img{
height: auto;
width: 100%;
}
.newrapp{
float: left;
height: auto;
margin-bottom: 17px;
padding-bottom: 12px;
width: 100%;
}
.newrapin{
float: left;
font-weight: 600;
height: auto;
width: auto;
}
.hide{
border-bottom: 1px dotted #cccccc;
float: left;
height: auto;
margin-bottom: 17px;
padding-bottom: 12px;
width: 100%;
}
.hide:last-child{
border-bottom: 0;
}
.colours .hide form{
float: left;
height: auto;
margin: 8px;
width: 100%;
}
.colours .hide form .hides{
float: left;
font-weight: 600;
height: auto;
line-height: 1em;
margin: 0 6px;
width: auto;
}
.colours .hide form .hide2 {
float: right;
font-weight: 300;
height: auto;
margin: 0 6px;
width: auto;
}
.colours .hide form .hide2 input {
background: none repeat scroll 0 0 #0099ff;
border: medium none;
color: #ffffff;
float: left;
font-size: 12px;
font-weight: 700;
height: auto;
line-height: 1.4em;
margin: -2px 3px 0;
padding: 3px 4px;
text-align: center;
width: 68px;
}
.colours .hide form .hide2 p{
float: left;
font-size: 12px;
font-weight: 300;
height: auto;
line-height: 1.9em;
margin: 0 6px;
width: auto;
}
.colours .hide form .hidesub {
float: right;
font-weight: 600;
height: auto;
margin: 0 6px;
width: auto;
}
.colours .showL{
float: left;
font-weight: 600;
height: auto;
margin: 0 6px;
width: auto;
}
.colours .showLbg {
float: left;
font-weight: 600;
height: auto;
margin: 0 6px;
width: 172px;
}
.colours .showLL {
float: left;
font-weight: 600;
height: auto;
margin: 0 6px;
width: 137px;
}
.colours .showLSUb {
float: right;
font-weight: 600;
height: auto;
margin: 0 6px;
width: auto;
}
.colours form{
float: left;
height: auto;
margin: 8px;
width: auto;
}
.colrimg{
border: 1px solid #e4e4e4;
float: left;
height: auto;
margin-bottom: -5px;
margin-top: -9px;
padding: 4px;
width: 113px;
}
.rTit11{
border-bottom: 1px dotted #c0c0c0;
float: left;
font-size: 23px;
font-weight: 600;
height: auto;
margin-bottom: 10px;
padding-bottom: 8px;
width: 100%;
}
.addPgeRight {
background-color: #f4f4f4;
border-radius: 0.3em;
float: right;
height: auto;
padding: 14px;
width: 44%;
}
.pageItem{
float: left;
height: auto;
width: 100%;
}
.pageItem p{
float: left;
font-size: 12px;
height: auto;
margin-bottom: 2px;
width: 100%;
}
.textfa{
border: 1px solid #c0c0c0;
border-radius: 0.3em;
float: left;
height: auto;
margin-bottom: 16px;
padding: 8px;
width: 96.5%;
}
.showPages .bbx{
float: left;
height: 232px;
margin: 6px 6px 18px;
position: relative;
width: 293px;
}
.bbx img{
height: 100%;
width: 100%;
}
.bbx p{
color: #000000;
font-size: 20px;
height: auto;
padding: 10px 20px;
position: absolute;
text-align: center;
width: 253px;
z-index: 7;
}
.bbx p input {
border: 1px solid #c0c0c0;
color: #000000;
float: left;
height: auto;
overflow: hidden;
padding: 5px;
text-align: left;
width: 237px;
}
.bbx textarea{
border: medium none;
color: white;
font-size: 14px;
font-weight: normal;
height: auto;
margin-top: 169px;
padding: 6px 10px;
position: absolute;
text-align: center;
width: 294px;
z-index: 9999;
}
.bop{
background-color: #ffffff;
border: 1px solid #808080;
color: #000000;
cursor: pointer;
font-size: 9px;
font-weight: normal;
height: auto;
margin-left: 193px;
margin-top: -13px;
padding: 5px;
position: absolute;
text-align: center;
width: auto;
z-index: 99999;
}
.bop:hover{
opacity: .4;
}
.bop:nth-child(1){
margin-left: 244px;
}
.sp{
width: 100%;
float: left;
height: 20px;
}
.bopIMG{
background-color: #ffffff;
border: 1px solid #808080;
color: #000000;
cursor: pointer;
font-size: 9px;
font-weight: normal;
height: auto;
margin-left: 8px;
margin-top: 55px;
overflow: hidden;
padding: 5px;
position: absolute;
text-align: center;
width: 73px;
z-index: 99999;
}
/*SLIDING DI CAOD*/

.slidingDiv {
height:300px;
background-color: #99CCFF;
padding:20px;
margin-top:10px;
border-bottom:5px solid #3399FF;
}

.show_hide {
display:none;
}
#showPPS{
background-color: #ffffff;
border: 1px solid #343434;
box-shadow: 0 4px 5px -5px #000000;
font-size: 9px;
font-weight: 600;
height: auto;
left: -4px;
padding: 10px 12px;
position: absolute;
text-decoration: none;
top: 223px;
width: auto;
}
#showPPS:hover{
opacity: .4;
left: -1px;
}
/*SLIDING DIV CODE*/
.pageInfo{
background-color: #ffffff;
border-bottom: 3px solid #000000;
height: 77px;
padding: 10px 0;
position: absolute;
width: 100%;
z-index: 2147483647;
}
.show_hide {
display:none;
}
.infoBaa{
background-image: url("../images/boxGRAYbg.jpg");
background-size: 100% 100%;
border: 1px solid #d8d8d8;
border-radius: 0.3em;
box-shadow: 0 4px 4px -5px #000000;
cursor: pointer;
float: left;
font-size: 16px;
font-weight: 600;
height: 54px;
line-height: 3.2em;
margin: 5px 5px 4px;
text-align: center;
text-decoration: none;
width: 32.3%;
}
.infoBaa:hover{
opacity: .4;
}
.infoBaaCLOSE{
float: left;
height: auto;
width: 100%;
}
.clll{
cursor: pointer;
float: right;
font-size: 14px;
height: auto;
padding: 0 16px;
text-decoration: none;
width: auto;
}
.clll:hover, .delrBoxRectaLin:hover{
opacity: .4;
}
.smplImgLin {
color: #ff0000;
font-size: 13px;
font-weight: bold;
height: auto;
margin-left: 5px;
margin-top: 91px;
position: absolute;
text-decoration: none;
text-shadow: 1px 1px #ffffff;
width: auto;
}
.delrBoxRectaLin {
color: yellow;
font-size: 13px;
font-weight: bold;
height: auto;
margin-left: -99px;
margin-top: -9px;
position: absolute;
text-decoration: none;
text-shadow: 1px 1px black;
width: auto;
}
.rBoxRectaLin {
color: yellow;
font-size: 13px;
font-weight: bold;
height: auto;
margin-left: -37px;
margin-top: -9px;
position: absolute;
text-decoration: none;
text-shadow: 1px 1px black;
width: auto;
}
.editCOnn{
color: #ff0000;
font-size: 13px;
font-weight: bold;
height: auto;
margin-left: 5px;
position: absolute;
text-decoration: none;
text-shadow: 1px 1px #ffffff;
width: auto;
}
.editCOnn:hover, .rBoxRectaLin:hover, .smplImgLin:hover{
opacity: .4;
}
/*REC BOXES*/
.recBs {
background-color: #ffffff;
border: 1px solid #343434;
box-shadow: 0 4px 5px -5px #000000;
font-size: 12px;
height: auto;
left: 32%;
min-width: 200px;
padding: 10px 12px;
position: absolute;
text-decoration: none;
top: -1px;
width: 439px;
z-index: 2147483647;
}
.recBs form{
float: left;
height: auto;
width: auto;
}
.recBs form p{
float: left;
font-size: 14px;
height: auto;
margin-bottom: 23px;
width: 100%;
}
.recBs form .subMit{
background: none repeat scroll 0 0 #1bb3ff;
border: 1px solid #b2b2b2;
color: white;
cursor: pointer;
float: right;
font-size: 14px;
font-weight: 300;
height: auto;
padding: 11px;
width: auto;
}
.recBs form .subMitX{
border: 1px solid #b2b2b2;
color: black;
cursor: pointer;
float: right;
font-size: 14px;
font-weight: 300;
height: auto;
margin-right: 4px;
padding: 10px;
width: auto;
}
.recBs form .subMit:hover{
opacity: .3;
}
.recBs form .text{
float: left;
font-size: 14px;
font-weight: 300;
height: auto;
margin-bottom: 13px;
width: 100%;
}
.recBs form .textBox{
float: left;
font-size: 14px;
font-weight: 300;
height: auto;
margin-bottom: 14px;
width: 98%;
}
.recBs a{
font-size: 12px;
height: auto;
text-decoration: none;
width: auto;
}
.recBs a:hover{
opacity: .3;
}
/*END REC BOXES*/
.editModal {
background-color: #ffffff;
border: 1px solid #343434;
box-shadow: 0 4px 5px -5px #000000;
font-size: 12px;
height: auto;
left: 32%;
min-width: 200px;
padding: 10px 12px;
position: absolute;
text-decoration: none;
top: -1px;
width: 439px;
z-index: 2147483647;
}
.editModal a{
font-size: 12px;
height: auto;
text-decoration: none;
width: auto;
}
.editModal a:hover{
opacity: .3;
}
.editModal textarea{
width: 100%;
min-height: 332px;
float: left;
}
.showIt{
background-color: #ffffff;
border: 1px solid #c0c0c0;
cursor: pointer;
left: 30%;
padding: 10px 13px;
position: absolute;
top: -1px;
width: auto;
z-index: 2147483647;
}

/* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width : 300px) and (max-device-width : 650px) {
.homeBody{
background-repeat: no-repeat;
background-size: 100% 445px;
font-family: "Open Sans",sans-serif;
font-size: 15px;
height: 100%;
margin: 0;
padding: 0;
width: 100%;
}
.inBody{
background-image: url("../images/insideBG.jpg");
background-repeat: no-repeat;
background-size: 100% 237px;
font-family: "Open Sans",sans-serif;
font-size: 15px;
margin: 0;
padding: 0;
height: 100%;
width: 100%;
}
.topSIN {
float: left;
height: 453px;
margin: auto;
width: 100%;
}
.top {
background: none repeat scroll 0 0 white;
height: 140px;
left: 0;
position: absolute;
right: 0;
width: 100%;
z-index: 22;
}   

}

.topHammie{
background: #000;
float: right;
width: 18px;
padding: 7px 12px 7px 12px;
border-radius: 6px;
cursor: pointer;
display: flex;
flex-direction: column;
justify-content: center;
transition: all .35s ease;
}

/* hover lift */
.topHammie:hover{
transform:translateY(-2px) scale(1.05);
box-shadow:0 6px 14px rgba(0,0,0,.25);
}

/* bars */
.topHammie div{
height:3px;
background:#fff;
width:100%;
margin:4px 0;
border-radius:2px;

transition:
transform .4s cubic-bezier(.68,-0.55,.27,1.55),
opacity .25s ease,
width .3s ease;
}

/* little hover wiggle */
.topHammie:hover div:nth-child(1){
width:85%;
}
.topHammie:hover div:nth-child(3){
width:70%;
}


/* ===== ACTIVE STATE (turn into X) ===== */

.topHammie.active div:nth-child(1){
transform:translateY(7px) rotate(45deg);
width:100%;
}

.topHammie.active div:nth-child(2){
opacity:0;
transform:scaleX(0);
}

.topHammie.active div:nth-child(3){
transform:translateY(-7px) rotate(-45deg);
width:100%;
}

body.menuOpen{
overflow:hidden;
}
/* NAV CONTAINER */
.mobileNav{
position:absolute;
top:70px;   /* set to your header height */
right:15px;

background:#000;
border-radius:10px;
overflow:hidden;

max-height:0;
opacity:0;
transform:translateY(-10px);

transition:
max-height .45s ease,
opacity .3s ease,
transform .35s ease;

box-shadow:0 15px 35px rgba(0,0,0,.3);
z-index:999;
}

.mobileNav.open{
max-height:520px; /* big enough for your links */
opacity:1;
transform:translateY(0);
}

/* UL RESET */
.mobileNav-ul{
list-style:none;
margin:0;
padding:10px 0;
}

.mobileNav-ul li{
border-bottom:1px solid rgba(255,255,255,.08);
}

.mobileNav-ul li:last-child{
border-bottom:none;
}

.mobileNav-ul a{
display:block;
padding:14px 22px;
color:#fff;
text-decoration:none;
font-weight:500;
transition:all .25s ease;
}

.mobileNav-ul a:hover{
background:#111;
padding-left:28px;
}

/* optional: lock scroll when open */
body.menuOpen{
overflow:hidden;
}

/* OVERLAY */
.navOverlay{
position: fixed;
inset: 0;
background: rgba(0, 0, 0, .55);
opacity: 0;
pointer-events: none;
transition: opacity .25s ease;
z-index: 998;
width: 100%;
height: 100svh;
}

.navOverlay.open{
opacity:1;
pointer-events:auto;
}

/* DRAWER */
.sideNav{
position:fixed;
top:0;
right:0;
height:100vh;
width:min(86vw, 340px);
background:#000;
color:#fff;
z-index:999;

transform:translateX(105%);
transition:transform .38s cubic-bezier(.22,.61,.36,1);
box-shadow:-18px 0 45px rgba(0,0,0,.35);

display:flex;
flex-direction:column;
}

.sideNav.open{
transform:translateX(0);
}

/* Header */
.sideNav-head{
display:flex;
align-items:center;
justify-content:space-between;
padding:18px 18px 14px 18px;
border-bottom:1px solid rgba(255,255,255,.10);
}

.sideNav-title{
font-size:16px;
letter-spacing:.08em;
text-transform:uppercase;
opacity:.9;
}

.sideNav-close{
appearance:none;
border:0;
background:transparent;
color:#fff;
font-size:28px;
line-height:1;
cursor:pointer;
padding:2px 6px;
border-radius:10px;
transition:background .2s ease, transform .2s ease;
}

.sideNav-close:hover{
background:rgba(255,255,255,.08);
transform:scale(1.06);
}

/* UL / LI */
.sideNav-ul{
list-style:none;
margin:0;
padding:10px 0;
overflow:auto;
-webkit-overflow-scrolling:touch;
}

.sideNav-ul li{
border-bottom:1px solid rgba(255,255,255,.08);
}

.sideNav-ul li:last-child{
border-bottom:none;
}

.sideNav-ul a{
display:block;
padding:16px 18px;
color:#fff;
text-decoration:none;
font-weight:500;
transition:background .2s ease, padding-left .2s ease;
}

.sideNav-ul a:hover{
background:rgba(255,255,255,.06);
padding-left:24px;
}

/* Lock page scroll when menu open */
body.menuOpen{
overflow:hidden;
}

/* Optional: respect reduced motion */
@media (prefers-reduced-motion: reduce){
.sideNav, .navOverlay{ transition:none; }
}